<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <div>001</div>
  <div>002</div>
  <div>003</div>
  <div>004</div>
  <div>005</div>
  <script>
    // 扩展运算符可以将数组或者对象转为逗号分隔的参数序列
    let ary = [1, 2, 3];
    // ...ary  //1,2,3
    console.log(...ary); //1 2 3
    // 相当于 
    // console.log(1,2,3); // 1 2 3

    //-----------------------扩展运算符应用于数组合并-------------
    let ary1 = [1, 2, 3]
    let ary2 = [4, 5, 6]
    // ...ary1 // 1,2,3
    // ...ary2 // 4,5,6
    // 方法一：
    let ary3 = [...ary1, ...ary2];
    console.log(ary3);  //(6) [1, 2, 3, 4, 5, 6]

    // 方法二：
    ary1.push(...ary2);
    console.log(ary1); //(6) [1, 2, 3, 4, 5, 6]

    //-----------------------利用扩展运算符将伪数组转为真正的数组-------------
    var div = document.querySelectorAll('div')
    console.log(div); //NodeList(5) [div, div, div, div, div] 伪数组
    div = [...div];
    console.log(div); //(5) [div, div, div, div, div]

  </script>
</body>

</html>